html, body, form, fieldset, p, div, h1, h2, h3, h4, h5, h6{
	margin:0;
	padding:0;
	-webkit-text-size-adjust:none;
	}
ul, li, ol, dl, dd, dt{
	list-style:none;
	padding:0;
	margin:0;
	}
img.alignright {float:right; margin:0 0 1em 1em}
img.alignleft {float:left; margin:0 1em 1em 0}
img.aligncenter {display: block; margin-left: auto; margin-right: auto}
a img.alignright {float:right; margin:0 0 1em 1em}
a img.alignleft {float:left; margin:0 1em 1em 0}
a img.aligncenter {display: block; margin-left: auto; margin-right: auto}

body { /*    The main method for handling non-moving backgrounds    */
	background: url(images/bg.jpg) top center;
    
    
    -moz-background-size:  100% auto ;
    -webkit-background-size: 100% auto ;
    background-size: 100% auto ;
    background-position:top center;
   
    overflow:hidden;

	background-repeat:no-repeat;
	background-attachment:fixed;
	background-position:top center;
	z-index:1;
	position:relative; top:0px; left:0px;
    margin: 0px 0px 0px 0px;    
    overflow:hidden;
    -webkit-user-select: none;  /* prevent copy paste for all elements */
    -webkit-text-size-adjust: none; /* turn off font resizing */
    }
    
img {width:100%; /*    The main method for handling inline images   
    
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
   box-shadow:inset 0 0 7px #000000;
   -moz-box-shadow:inset 0 0 7px #000000;
   -webkit-box-shadow:inset 0 0 7px #000000; */
    }
p   {padding: 0px 0px 15px 0px ;
    text-align:justify;
    }

.thumb {
    height:75px;
    width:auto;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
   box-shadow:inset 0 0 10px #000000;
   -moz-box-shadow:inset 0 0 10px #000000;
   -webkit-box-shadow:inset 0 0 10px #000000;
}

.background { /*    The main method for handling moving backgrounds    */
	background: url(../photos/01.jpg);
    -moz-background-size: 100% auto;
    -webkit-background-size: 100% auto;
    background-size: 100% auto;
	background-repeat:no-repeat;
	background-attachment:fixed;
	background-position:top center;
	z-index:-5;
    overflow:hidden;
    -webkit-user-select: none;  /* prevent copy paste for all elements */
    -webkit-text-size-adjust: none; /* turn off font resizing */
    width:100%;
    height:auto;
    min-height:100%;
    min-width:100%;
    }
    
a {text-decoration:none; color:white;}  

h1 {font-size: 20px;
    font-family: "American Typewriter";
    color:white;
    text-shadow: 0.1em 0.1em 0.2em black;
    text-align:center;
	}
    
h2  {font-size:12px;
    color:white;
    text-align:center;
    font-family: "AppleGothic", tahoma, arial;
    }

h3  {font-size:14px;
    color:black;
    text-align:center;
    font-family: "Futura", tahoma, arial;
    }
h4  {font-size:18px;
    color:white;
    text-align:center;
    font-family: "Futura", tahoma, arial;
    text-shadow: 0.1em 0.1em 0.2em black;
    }    

.loading{background:rgba(0, 0, 0, 0.3) url(../img/loading.gif) center center no-repeat;display:block;width:10em;height:10em;position:absolute;top:50%;left:50%;margin-left:-5em;margin-top:-5em;-webkit-border-radius:.5em;color:#fff;text-shadow:#000 0 1px 1px;text-align:center;padding-top:8em;font-weight:bold}
    
.inner-shadow {
   box-shadow:inset 0 0 10px #ffffff;
   -moz-box-shadow:inset 0 0 10px #ffffff;
   -webkit-box-shadow:inset 0 0 10px #ffffff;
}

.thumb {
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
   box-shadow:0px 0px 20px black;
  -webkit-box-shadow:0px 0px 20px black;
  -moz-box-shadow:0px 0px 20px black;
    width:auto;
    height:75px;
    }

#issue-wrapper{ /*    The main 'container' for each page    */
	z-index:10;
    position:relative;
	width:75%;
    text-align:center;
    margin:5px 5px 5px 5px;
    -webkit-user-select: none;  /* prevent copy paste for all elements */
	}
.space-padding-100{ /*    blank space 100px high    */
    height:100px;
    width:100%;
    }
.space-padding-75{ /*    blank space 75px high    */
    height:75px;
    width:100%;
    }
.space-padding-25{ /*    blank space 25px high    */
    height:25px;
    width:100%;
    }
.issue-title { /*    Hw the title of the magazine will be displayed    */
	vertical-align:middle;
	position:fixed;
	margin:10px 10px 10px 10px;
    top:0px;
	background: url(images/blacktrans2.png);
	height:75px;
    width:75%;    
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;    
   box-shadow:inset 0 0 10px #fff;
   -moz-box-shadow:inset 0 0 10px #fff;
   -webkit-box-shadow:inset 0 0 10px #fff;
    -webkit-user-select: none;  /* prevent copy paste for all elements */
	}   

.description { //the description of the issue
    text-shadow:none;
    }

    
#issue-container { //for the contents list
	position:fixed;
	// height:210px;
    margin:0px 0px 20px 0px;
    z-index:3;
	}

.article-link { // how the table of contents is displayed
	vertical-align: middle;
	height:auto;
	position:relative;
	margin:5px 5px 10px 5px;
    padding: 10px 10px 10px 10px;
	background: url(images/whitetrans3.png);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;    
   box-shadow:inset 0 0 10px #000000;
   -moz-box-shadow:inset 0 0 10px #000000;
   -webkit-box-shadow:inset 0 0 10px #000000;   
    display:block;
	}

.article-title { //the title for the article
	font-size:25px;
	color:white;
	text-align:center;
	vertical-align:middle;
	position:relative;
    top:5 px;
	z-index:5;
	margin:5px 5px 10px 5px;
    padding: 10px 10px 0px 10px;
	background: url(images/blacktrans2.png);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
   box-shadow:inset 0 0 10px #000000;
   -moz-box-shadow:inset 0 0 10px #000000;
   -webkit-box-shadow:inset 0 0 10px #000000;
    display:block;
    }

.left-side{
  padding: 6px;
  margin:10px;
  -webkit-border-radius: 5px;
  -webkit-box-shadow:0px 0px 20px black;
  -moz-box-shadow:0px 0px 20px black;
    float:left;
	background: url(images/whitetrans2.png);
	left:0px;
	width:51%;
    }
    
.right-side{
  padding: 6px;
  margin:10px;
  -webkit-border-radius: 5px;
  -webkit-box-shadow:0px 0px 20px black;
  -moz-box-shadow:0px 0px 20px black;
    float:right;
	background: url(images/whitetrans2.png);
	left:50%;
	width:50%;
    }
.full-side{
  padding: 6px;
  margin:10px;
  -webkit-border-radius: 5px;
  -webkit-box-shadow:0px 0px 20px black;
  -moz-box-shadow:0px 0px 20px black;
    float:left;
	background: url(images/whitetrans2.png);
	left:0px;
	width:100%;
    }
    
.text{
    font-size: 16px;
    font-family: "Georgia";
    font-style:strong;
    color:#000;
    -webkit-box-flex:1;
    overflow:hidden;
    padding:10px 10px 15px 10px;
    -webkit-user-select: text;  /* enable copy paste for elements with this class */
    }

a: hover { text-decoration:none; color:#aaa;}
a: active { text-decoration:none; color:#aaa;}
a: visited { text-decoration:none; color:#aaa;}
a: link { text-decoration:none; color:#aaa;}

/*******************************************************/
/*   Orientation changes for the background and size   */
/*******************************************************/

/* Portrait */
@media screen and (orientation:portrait){

}
/* Landscape */
@media screen and (orientation:landscape){

}

/*********************************/
/*                               */
/* For smaller devices landscape */
/*                               */
/*********************************/

@media screen and (min-width: 321px) and (max-width:480px){

body{
    -moz-background-size: 480px auto;
    -webkit-background-size: 480px auto;
    background-size: 480px auto;
    background-position:top center;
    height:320px;
    overflow:hidden;
	}
img {width:480px;
 The main method for handling inline images    
    
    height:150px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
   box-shadow:inset 0 0 10px #000000;
   -moz-box-shadow:inset 0 0 10px #000000;
   -webkit-box-shadow:inset 0 0 10px #000000;
    }
#issue-wrapper {
	width:50%;
	overflow:hidden;
	}


.left-side{
  padding: 6px;
  margin:10px;
  -webkit-border-radius: 5px;
  -webkit-box-shadow:0px 0px 20px black;
  -moz-box-shadow:0px 0px 20px black;
    float:left;
	background: url(images/whitetrans2.png);
	left:0px;
	width:50%;
    margin:10px 10px 10px 10px;
    }
.right-side{
  padding: 6px;
  margin:10px;
  -webkit-border-radius: 5px;
  -webkit-box-shadow:0px 0px 20px black;
  -moz-box-shadow:0px 0px 20px black;
    float:right;
	background: url(images/whitetrans2.png);
	left:50%;
	width:50%;
    margin:10px 10px 10px 10px;
    }
.full-side{
  padding: 6px;
  margin:10px;
  -webkit-border-radius: 5px;
  -webkit-box-shadow:0px 0px 20px black;
  -moz-box-shadow:0px 0px 20px black;
	background: url(images/whitetrans2.png);
	left:5%;
	width:90%;
    margin:10px 10px 10px 10px;
    }

#issue-container {
	
	}
.article-title { //the title for the article
	position:relative bottom;
	height:50px;
	}
.issue-title { //the title for the magazine
	width:50%
    }
.background {
    -moz-background-size: 480px auto;
    -webkit-background-size: 480px auto;
    background-size: 480px auto;
    background-position:top center;
    width:480px;
    height:320px;
    overflow:hidden; 
    }   


}
/*********************************/
/*                               */
/* For smaller devices  Portrait */
/*                               */
/*********************************/
@media screen and (max-width:320px){

body{
    -moz-background-size: auto 480px;
    -webkit-background-size: auto 480px;
    background-size: auto 480px;
    background-position:top center;
	height:480px;
    width:auto;
    overflow:hidden;
    }
img {
    width:320px;/*
    height:75px;*/
    }
#issue-wrapper {
	width:75%;
	overflow:hidden;
	}
    
.left-side{
  padding: 6px;
  margin:10px;
  -webkit-border-radius: 5px;
  -webkit-box-shadow:0px 0px 20px black;
  -moz-box-shadow:0px 0px 20px black;
    float:left;
	background: url(images/whitetrans2.png);
	left:0px;
	width:75%;
    margin:10px 10px 10px 10px;
    }
.right-side{
  padding: 6px;
  margin:10px;
  -webkit-border-radius: 5px;
  -webkit-box-shadow:0px 0px 20px black;
  -moz-box-shadow:0px 0px 20px black;
    float:right;
	background: url(images/whitetrans2.png);
	left:25%;
	width:75%;
    margin:10px 10px 10px 10px;
    }
.full-side{
  padding: 6px;
  margin:10px;
  -webkit-border-radius: 5px;
  -webkit-box-shadow:0px 0px 20px black;
  -moz-box-shadow:0px 0px 20px black;
	background: url(images/whitetrans2.png);
	left:5%;
	width:90%;
    margin:10px 10px 10px 10px;
    }

#issue-container {
	height:auto;
	}
.article-title { //the title for the article
	position:relative top;
    height:56px;
	}
    
.background {
    -moz-background-size: auto 480px;
    -webkit-background-size: auto 480px;
    background-size: auto 480px;
    background-position:top center;
	height:480px;
    width:320px;
    overflow:hidden;
    }
}
@media only screen and (max-width: 999px) {
  /* rules that only apply for canvases narrower than 1000px */
}
/*
@media only screen and (device-width: 768px) and (orientation: landscape) {
  /* rules for iPad in landscape orientation */
}
/*
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
  /* iPhone, Android rules here */
}
